<template>
  <el-dialog
    top="30px"
    width="800px"
    class="dialog-sm"
    append-to-body
    title="退费详情"
    :visible.sync="visible"
    :close-on-click-modal="false"
    :before-close="beforeClose"
  >
    <el-tag :type="editRow.refundStatusStyle">{{ editRow.refundStatus || '' }}</el-tag>
    <table class="table table-sm table-borderless mt-4">
      <tbody>
        <tr>
          <td width="15%">退费主体：</td>
          <td width="35%">{{ editRow.customer_name || '-' }}</td>
          <td width="15%">地址：</td>
          <td width="35%">{{ editRow.address || '-' }}</td>
        </tr>
        <tr>
          <td>项目负责人：</td>
          <td>{{ editRow.corp_name || '-' }}</td>
          <td>联系电话：</td>
          <td>{{ editRow.mobile_no || '-' }}</td>
        </tr>
        <tr>
          <td>在保余额：</td>
          <td>{{ editRow.left_funds || '-' }}万元</td>
          <td>担保费率：</td>
          <td>{{ editRow.gua_rate || '-' }}%</td>
        </tr>
        <tr>
          <td>缴费金额：</td>
          <td>{{ editRow.actual_warrant_fee || '-' }}元</td>
          <td>缴费时间：</td>
          <td>{{ actualWarrantDate || '-' }}</td>
        </tr>
        <tr>
          <td>退费金额：</td>
          <td>{{ editRow.refund_funds || '-' }}元</td>
          <template v-if="refundStatus < 1">
            <td>退费申请时间：</td>
            <td>{{ applyRefundTime || '-' }}</td>
          </template>
          <template v-else>
            <td>退费时间：</td>
            <td>{{ refundTime || '-' }}</td>
          </template>
        </tr>
        <tr>
          <td>退费原因：</td>
          <td colspan="3">{{ editRow.refund_reason || '-' }}</td>
        </tr>
        <tr>
          <td>退费附件：</td>
          <td colspan="3">
            <img-card :images="attachImages"></img-card>
          </td>
        </tr>
        <tr v-if="refundStatus === 2">
          <td>账务部处理附件：</td>
          <td colspan="3">
            <img-card :images="accountAttachImages"></img-card>
          </td>
        </tr>
      </tbody>
    </table>
  </el-dialog>
</template>

<script>
import { arrayFromString } from '@vimi/utils-tool'

import ImgCard from '@/components/ImgCard'

export default {
  components: {
    ImgCard,
  },
  props: {
    visible: Boolean,
    editRow: {
      type: Object,
      default() {
        return {}
      },
    },
  },
  data() {
    return {
      saveLoading: false,
    }
  },
  computed: {
    refundStatus() {
      return +this.editRow.refund_status
    },
    attachImages() {
      return arrayFromString(this.editRow.apply_refund_attachment)
    },
    accountAttachImages() {
      return arrayFromString(this.editRow.refund_attachment)
    },
    actualWarrantDate() {
      return this.$utils.dateFormat(this.editRow.actual_warrant_date, 'yyyy年MM月dd日')
    },
    applyRefundTime() {
      return this.$utils.dateFormat(this.editRow.apply_refund_time, 'yyyy年MM月dd日')
    },
    refundTime() {
      return this.$utils.dateFormat(this.editRow.refund_time, 'yyyy年MM月dd日')
    },
  },
  watch: {},
  created() {},
  mounted() {},
  methods: {
    beforeClose() {
      this.$emit('update:visible', false)
    },
  },
}
</script>

<style lang="scss" scoped></style>
